<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body onload="Chu()">
		<div style="margin: 0px auto;width: 300px;height: 300px;">
			<div id="jishi"></div>
			<input type="button" id="a" value="开始" onclick="st(this)"/>
			<input type="button" value="重置" onclick="Re()"/>
		</div>
	</body>
	<script type="text/javascript">
		var h=m=s=ms=0;
		var timer;
		
		//初始
		function Chu(){
			if(ms>=1000){
				ms=0;
				s+=1;
			}
			if(s>=60){
				s=0;
				m+=1;
			}
			if(m>=60){
				m=0;
				h+=1;
			}
			document.getElementById("jishi").innerHTML=Bu(h)+":"+Bu(m)+":"+Bu(s)+":"+Bums(ms);
			ms+=10;
		}
		
		//开始
		function Startt(){
			timer = setInterval("Chu()",10);
		}
		
		//停止
		function Stupt(){
			clearInterval(timer);
		}
		
		//改变按钮
		function st(val){
			switch (val.value){
				case "停止":
					Stupt();
					val.value="开始"
					break;
				case "开始":
					Startt();
					val.value="停止"
					break;
				default:
					break;
			}
		}
		
		//重置
		function Re(){
			clearInterval(timer);
			h=m=s=ms=0;
			Chu();
			var a = document.getElementById("a");
			switch (a.value){
				case "停止":
					a.value = "开始";
					break;
				default:
					break;
			}
		}
		
		function Bu(n){
			if(n<10){
				return "0"+n;
			}else{
				return n;
			}
		}
		function Bums(n){
			if(n<10){
				return "00"+n;
			}else{
				return "0"+n;
			}
		}
	</script>
</html>
